<!--头部信息-->
<script src="/statics/js/system/theme.js"></script>
<header class="lyear-layout-header">

    <nav class="navbar">

        <div class="navbar-left">
            <div class="lyear-aside-toggler">
                <span class="lyear-toggler-bar"></span>
                <span class="lyear-toggler-bar"></span>
                <span class="lyear-toggler-bar"></span>
            </div>
        </div>

        <ul class="navbar-right d-flex align-items-center">
            <!--锁定屏幕-->
            <a id="lock" style="color: #4d5259;cursor: pointer;"><i class="mdi mdi-lock mdi-18px"></i></a>
            <!--切换主题配色-->
            <li class="dropdown dropdown-skin">
                <span data-toggle="dropdown" class="icon-item"><i class="mdi mdi-palette"></i></span>
                <ul class="dropdown-menu dropdown-menu-right" data-stopPropagation="true">
                    <li class="drop-title"><p>主题</p></li>
                    <li class="drop-skin-li clearfix">
                <span class="inverse">
                  <input type="radio" name="site_theme" class="mxTheme" data-name="data-theme" value="default" id="site_theme_1" checked>
                  <label for="site_theme_1"></label>
                </span>
                        <span>
                  <input type="radio" name="site_theme" class="mxTheme" data-name="data-theme" value="dark" id="site_theme_2">
                  <label for="site_theme_2"></label>
                </span>
                        <span>
                  <input type="radio" name="site_theme" class="mxTheme" data-name="data-theme" value="translucent" id="site_theme_3">
                  <label for="site_theme_3"></label>
                </span>
                    </li>
                    <li class="drop-title"><p>LOGO</p></li>
                    <li class="drop-skin-li clearfix">
                <span class="inverse">
                  <input type="radio" name="logo_bg" class="mxTheme" data-name="data-logobg" value="default" id="logo_bg_1" checked>
                  <label for="logo_bg_1"></label>
                </span>
                        <span>
                  <input type="radio" name="logo_bg" class="mxTheme" data-name="data-logobg" value="color_2" id="logo_bg_2">
                  <label for="logo_bg_2"></label>
                </span>
                        <span>
                  <input type="radio" name="logo_bg" class="mxTheme" data-name="data-logobg" value="color_3" id="logo_bg_3">
                  <label for="logo_bg_3"></label>
                </span>
                        <span>
                  <input type="radio" name="logo_bg" class="mxTheme" data-name="data-logobg" value="color_4" id="logo_bg_4">
                  <label for="logo_bg_4"></label>
                </span>
                        <span>
                  <input type="radio" name="logo_bg" class="mxTheme" data-name="data-logobg" value="color_5" id="logo_bg_5">
                  <label for="logo_bg_5"></label>
                </span>
                        <span>
                  <input type="radio" name="logo_bg" class="mxTheme" data-name="data-logobg" value="color_6" id="logo_bg_6">
                  <label for="logo_bg_6"></label>
                </span>
                        <span>
                  <input type="radio" name="logo_bg" class="mxTheme" data-name="data-logobg" value="color_7" id="logo_bg_7">
                  <label for="logo_bg_7"></label>
                </span>
                        <span>
                  <input type="radio" name="logo_bg" class="mxTheme" data-name="data-logobg" value="color_8" id="logo_bg_8">
                  <label for="logo_bg_8"></label>
                </span>
                    </li>
                    <li class="drop-title"><p>头部</p></li>
                    <li class="drop-skin-li clearfix">
                <span class="inverse">
                  <input type="radio" name="header_bg" class="mxTheme" data-name="data-headerbg" value="default" id="header_bg_1" checked>
                  <label for="header_bg_1"></label>
                </span>
                        <span>
                  <input type="radio" name="header_bg" class="mxTheme" data-name="data-headerbg" value="color_2" id="header_bg_2">
                  <label for="header_bg_2"></label>
                </span>
                        <span>
                  <input type="radio" name="header_bg" class="mxTheme" data-name="data-headerbg" value="color_3" id="header_bg_3">
                  <label for="header_bg_3"></label>
                </span>
                        <span>
                  <input type="radio" name="header_bg" class="mxTheme" data-name="data-headerbg" value="color_4" id="header_bg_4">
                  <label for="header_bg_4"></label>
                </span>
                        <span>
                  <input type="radio" name="header_bg" class="mxTheme" data-name="data-headerbg" value="color_5" id="header_bg_5">
                  <label for="header_bg_5"></label>
                </span>
                        <span>
                  <input type="radio" name="header_bg" class="mxTheme" data-name="data-headerbg" value="color_6" id="header_bg_6">
                  <label for="header_bg_6"></label>
                </span>
                        <span>
                  <input type="radio" name="header_bg" class="mxTheme" data-name="data-headerbg" value="color_7" id="header_bg_7">
                  <label for="header_bg_7"></label>
                </span>
                        <span>
                  <input type="radio" name="header_bg" class="mxTheme" data-name="data-headerbg" value="color_8" id="header_bg_8">
                  <label for="header_bg_8"></label>
                </span>
                    </li>
                    <li class="drop-title"><p>侧边栏</p></li>
                    <li class="drop-skin-li clearfix">
                <span class="inverse">
                  <input type="radio" name="sidebar_bg" class="mxTheme" data-name="data-sidebarbg" value="default" id="sidebar_bg_1" checked>
                  <label for="sidebar_bg_1"></label>
                </span>
                        <span>
                  <input type="radio" name="sidebar_bg" class="mxTheme" data-name="data-sidebarbg" value="color_2" id="sidebar_bg_2">
                  <label for="sidebar_bg_2"></label>
                </span>
                        <span>
                  <input type="radio" name="sidebar_bg" class="mxTheme" data-name="data-sidebarbg" value="color_3" id="sidebar_bg_3">
                  <label for="sidebar_bg_3"></label>
                </span>
                        <span>
                  <input type="radio" name="sidebar_bg" class="mxTheme" data-name="data-sidebarbg" value="color_4" id="sidebar_bg_4">
                  <label for="sidebar_bg_4"></label>
                </span>
                        <span>
                  <input type="radio" name="sidebar_bg" class="mxTheme" data-name="data-sidebarbg" value="color_5" id="sidebar_bg_5">
                  <label for="sidebar_bg_5"></label>
                </span>
                        <span>
                  <input type="radio" name="sidebar_bg" class="mxTheme" data-name="data-sidebarbg" value="color_6" id="sidebar_bg_6">
                  <label for="sidebar_bg_6"></label>
                </span>
                        <span>
                  <input type="radio" name="sidebar_bg" class="mxTheme" data-name="data-sidebarbg" value="color_7" id="sidebar_bg_7">
                  <label for="sidebar_bg_7"></label>
                </span>
                        <span>
                  <input type="radio" name="sidebar_bg" class="mxTheme" data-name="data-sidebarbg" value="color_8" id="sidebar_bg_8">
                  <label for="sidebar_bg_8"></label>
                </span>
                    </li>
                </ul>
            </li>
            <!--个人信息-->
            <li class="dropdown dropdown-profile">
                <a href="javascript:void(0)" data-toggle="dropdown" class="dropdown-toggle">
                    <img class="img-avatar img-avatar-48 m-r-10" id="photoUri" src="/statics/images/no_image.gif"
                         alt="管理员"/>
                    <span id="userName"></span>
                </a>
                <ul class="dropdown-menu dropdown-menu-right">
                    <li>
                        <a class="dropdown-item" href="/security/admin/info.html"><i class="mdi mdi-account"></i> 个人信息</a>
                    </li>
                    <li>
                        <a class="dropdown-item" href="/security/admin/password.html"><i
                                class="mdi mdi-lock-outline"></i> 修改密码</a>
                    </li>
                    <li class="dropdown-divider"></li>
                    <li>
                        <a class="dropdown-item" href="javascript:void(0)" id="logout"><i
                                class="mdi mdi-logout-variant"></i> 退出登录</a>
                    </li>
                </ul>
            </li>
        </ul>

    </nav>
    <!--菜单日志-->
    <nav>
        <div class="d-flex justify-content-between align-items-center logMenu">
            <div class="suspension" id="scrollUpButton">
                <i class="mdi mdi-chevron-double-left "></i>
            </div>
            <div class="suspensionContent" id="logMenu">
            </div>
            <div class="d-flex">
                <div class="suspension" id="scrollDownButton">
                    <i class="mdi mdi-chevron-double-right"></i>
                </div>
            </div>
        </div>
    </nav>
    <div class="rightMenu" id="contextMenu">

    </div>
</header>
<div class="locking-box" style="display: none;">
    <div class="time d-flex">
        <div id="time"></div>&nbsp;&nbsp;<div id="day"></div>&nbsp;&nbsp;<div id="week"></div>
    </div>
    <div class="locking">
        <div class="avatar">
            <img id="lockPhotoUri" src="/statics/images/touxiang.png" style="border-radius: 50%">
        </div>
        <div class="title" id="lockUserName"></div>
        <div class="input" id="lockFom">
            <input type="hidden" name="id" id="id">
            <input type="password" name="password" placeholder="请输入密码">
            <div class="but mx_validator_button">
                <i class="mdi mdi-arrow-right mdi-18px"></i>
            </div>
        </div>
        <div style="color: #fff">锁屏中,请解锁~~</div>
    </div>
</div>
<script type="text/javascript" src="/statics/js/custom/lock.js"></script>
<script type="text/javascript">
    $(function () {
        if (!Token.expires()) {
            LayerUtil.failMsg(ERROR_MSG.NO_LOGIN)
            setTimeout(function () {
                window.location.href = LOGIN_VIEW;
            }, 1000)
            return false;
        }
        //设置日志菜单
        LogMenu.showMenu();
        //获取用户
        const userInfo = $.trim(User.get())
        if (userInfo !== undefined && userInfo !== null && userInfo.length > 0) {
            let arrData = (typeof userInfo == 'object') ? userInfo : JSON.parse(userInfo);
            $("#photoUri").attr("src", arrData.photoUri ? arrData.photoUri : "/statics/images/no_image.gif");
            $("#lockPhotoUri").attr("src", arrData.photoUri ? arrData.photoUri : "/statics/images/no_image.gif");
            $("#userName").html(arrData.realName != null ? arrData.realName : arrData.userName);
            $("#lockUserName").html(arrData.realName != null ? arrData.realName : arrData.userName);
            $("#id").val(arrData.id);
        } else {
            $("#photoUri").attr("src", "/statics/images/no_image.gif");
            $("#userName").html("默认管理员");
        }

        // 退出登录
        $(document).on('click', '#logout', function () {
            Request.builder()
                .url(ADMIN_LOGOUT)
                .isToken(true)
                .callback(function (e) {
                    if (e.code === "00000") {
                        LayerUtil.successMsg("退出成功~")
                        setTimeout(function () {
                            Token.remove()
                            Menu.remove()
                            Menu.removePermission();
                            User.remove()
                            window.location.href = LOGIN_VIEW + "?logout=1";
                        }, 1000)
                    } else {
                        LayerUtil.failMsg("退出失败")
                    }
                })
                .post();
        });

        // 点击用户名显示隐藏菜单
        $(document).on('click', '.lyear-aside-toggler', function () {
            $('.lyear-layout-sidebar').toggleClass('lyear-aside-open');
            $("body").toggleClass('lyear-layout-sidebar-close');

            if ($('.lyear-mask-modal').length == 0) {
                $('<div class="lyear-mask-modal"></div>').prependTo('body');
            } else {
                $('.lyear-mask-modal').remove();
            }
        });
    });


</script>
<!--End 头部信息-->
